.server{
    width: 100vw;
    height: 100vh;
    .mian{
        width: 100%;
        height: calc(100% - 110px);
        .listBox{
            width: 100%;
            height: 100%;
            overflow-y: scroll;
            .listItem{
                width: 100%;
                display: flex;
                padding: 10px;
                .imgBox{
                    width: 40px;
                    height: 40px;
                    border-radius: 25%;
                }
                .msgbox{
                    background-color: #ccc;
                    border-radius: 20px;
                    padding: 10px;
                    
                    
                }
            }
            .listItem2{
                width: 100%;
                display: flex;
                flex-direction: row-reverse;
                padding: 10px;

                .imgBox{
                    width: 40px;
                    height: 40px;
                    border-radius: 25%;
                }
                .msgbox{
                    background-color: greenyellow;
                    border-radius: 20px;
                    padding: 10px;


                    
                }
            }
        }
    }
    .footer{
        width: 100%;
        height: 60px;
        padding: 10px;
        display: flex;
        justify-content: space-around;
        input{
            flex: 1;
            margin-right: 10px;
        }
        button{
            border-radius: 20px;
            border: none;
            background-color: blue;
            color: #fff;
            padding: 10px 20px;
        }
    }
}
